<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>按巡更总数查询</title>
		<link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
		<script src="js/jquery-1.4.2.js" type="text/javascript" charset="utf-8"></script>
		<script src="layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			  body{
				  overflow-y: hidden;
				  overflow: hidden;
			  }
		</style>
	</head>
	<body>

	<!--<div class="demoTable layui-input-inline">-->
		<!--搜索总数：-->
		<!--<div class="layui-inline">-->
			<!--<input class="layui-input" name="total" id="demoReload" autocomplete="off">-->
		<!--</div>-->		<!--<button class="layui-btn" data-type="reload">搜索</button>-->
	<!--</div>-->

	<form class="layui-form">
		<div class="layui-form-item layui-input-inline"> <!-- 注意：这一层元素并不是必须的 -->
			<label class="layui-form-label">时间选择</label>
			<div class="layui-input-inline" style="width: 100px;">
				<input type="text" name="price_min"class="layui-input" id="star_time"/>
			</div>
			<div class="layui-form-mid">-</div>
			<div class="layui-input-inline" style="width: 100px;">
				<input type="text" name="price_max" id="end_time" class="layui-input"/>
			</div>
			<button class="layui-btn" lay-submit lay-filter="formDemo">导出</button>
		</div>
	</form>

		<script type="text/html" id="toolbarDemo">
			<div class="layui-btn-container">
				<button class="layui-btn layui-btn-sm" lay-event="getInsert">新增</button>
				<button class="layui-btn layui-btn-sm" lay-event="getRefresh">刷新</button>
			</div>
		</script>
		<script type="text/html" id='barDemo'>

			<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
		</script>
		<table id="demo" lay-filter="test"></table>
		<script>
		//一般直接写在一个js文件中
		layui.use('table', function(){
		  var table = layui.table;
		  
		  //第一个实例
		  table.render({
		    elem: '#demo'
		    ,height: 550
		    ,url: '/api/patrol/selectPage' //数据接口
		    ,page: true //开启分页
		    ,cols: [[ //表头
			   {type: 'checkbox', fixed: 'left'}
		      ,{field: 'total', title: '巡更人员总数', width:140, sort: true, fixed: 'left'}
		      ,{field: 'date', title: '日期', width:140}
		      ,{field: 'todaySum', title: '今日到岗人数', width:140, sort: true,edit:'text'}
		      ,{field: 'patrolSum', title: '巡更点总数', width: 120, sort: true,edit:'text'}
			  ,{field: 'taskSum', title: '任务点总数', width: 120, sort: true,edit:'text'}
			  ,{field: 'notSum', title: '查漏总数', width: 120, sort: true,edit:'text'}
			  ,{field:'操作',toolbar:"#barDemo"}
		    ]],
			id: 'demo',
			toolbar: '#toolbarDemo',//开启自定义工具行，指向自定义工具栏模板选择器
			defaultToolbar: ['filter', 'print', 'exports']
		  });
		  table.on('toolbar(test)', function (obj) {
		      var checkStatus = table.checkStatus(obj.config.id);
		      switch (obj.event) {
			  
		      	case 'getInsert':
		              layer.open({
		              	type: 2,
		              	area:['50%','90%'],
		              	content: "addSum.html" ,//不想让iframe出现滚动可以content: ['http://sentsin.com', 'no']
		              	title: ['人员添加', 'font-size:18px;'],
		              	shade:['0.2','red']
		              });
		              break;

		          case 'getRefresh':
		              layer.msg("这是刷新", { icon: 6, anim: 6 });
		              //location.reload();
		              break;
		      	}
		  });
		  
		  table.on('tool(test)',function(obj){
		  			var data = obj.data; //获得当前行数据
		  			 var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
		  			 var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
		  
		  			   if(layEvent === 'detail'){ //查看
		  			     //do somehing
		  			   } else if(layEvent === 'del'){ //删除
		  			     layer.confirm('确认删除此行？', function(index){
		  			       obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
		  			       layer.close(index);
		  			       //向服务端发送删除指令
		  			     });
		  			   }
		  			 
		  			 
		  });

			table.on('edit(test)',function(obj){
				console.log(obj);
				//获取修改后的值
				var value=obj.value;
				//获取当前修改的对象
				var data=obj.data;
				//获取修改的字段名
				var field=obj.field;
				layer.msg("【ID："+data.ID+"】的"+field+"字段的值修改为"+value);
			});


			var $ = layui.$, active = {
				reload: function(){
					var demoReload = $('#demoReload');
					var demoReload2=$('#test10');

					//执行重载
					table.reload('demo', {
						page: {
							curr: 1 //重新从第 1 页开始
						}
						,where: {
							key: {
								total: demoReload.val()
							}
						}
					});
					table.reload('demo', {
						page: {
							curr: 1 //重新从第 1 页开始
						}
						, where: {
							key: {
								riqi: demoReload2.val()
							}
						}
					});
				}
			};

			$('.demoTable .layui-btn').on('click', function(){
				var type = $(this).data('type');
				active[type] ? active[type].call(this) : '';
			});

            layui.use('laydate', function(){
                var laydate = layui.laydate;

                //执行一个laydate实例
                laydate.render({
                    elem: '#star_time', //指定元素
                    type:'datetime'
                });
                laydate.render({
                    elem: '#end_time', //指定元素
                    type:'datetime'
                });

            });

            layui.use('form',function () {
                var $=layui.jquery;
                var form=layui.form;
                var laydate=layui.laydate;
                form.on('submit(formDemo)',function (data) {
                    window.location.href="/api/patrol/exportData/" + $("#star_time").val() + "/" + $("#end_time").val();
                    return false;
                });
            });
		});
		</script> 
	</body>
</html>
